<template>
	<sc-table-select @change="onChange" ref="select" style="opacity: 0; height: 1px;width: 1px;" v-model="selectModel"
		:multiple="false" :apiObj="$API.system.media.list" :table-width="800" clearable collapse-tags
		collapse-tags-tooltip>
		<template #header="{form, submit}">
			<div style="display: flex;">
				<el-form :inline="true" :model="form">
					<el-form-item>
						<el-input v-model="form.keyword"></el-input>
					</el-form-item>
					<el-form-item>
						<el-button type="primary" @click="submit">查询</el-button>
					</el-form-item>
				</el-form>
				<div style="flex: 1;">
					&nbsp;
				</div>
			</div>
		</template>
		<el-table-column prop="id" label="编号" width="180"></el-table-column>
		<el-table-column label="预览" width="120">
			<template #default="{row}">
				<img style="max-width: 35px; max-height: 35px; object-fit: contain;"
					:src="row.src+'?x-oss-process=image/resize,w_35&t='" :alt="row.title" />
			</template>
		</el-table-column>
		<el-table-column prop="title" label="名称" width="220"></el-table-column>
		<el-table-column prop="type" label="类型" width="80"></el-table-column>
		<el-table-column prop="created_at" label="创建时间"></el-table-column>
	</sc-table-select>
</template>

<script>
	var _this;

	import {
		defineAsyncComponent
	} from 'vue';
	const scEditor = defineAsyncComponent(() => import('@/components/scEditor'));

	export default {
		emits: ['success', 'closed'],
		components: {
			scEditor
		},
		data() {
			return {
				selectModel: [],
				cb: null
			}
		},
		mounted() {
			_this = this;
		},
		methods: {
			onChange(e) {
				this.cb && this.cb(e)
			},
			toggleMenu(cb) {
				this.cb = cb;
				this.$refs.select.$refs.select.toggleMenu();
			}
		}
	}
</script>

<style scoped>

</style>
